<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>demo_two.html</title>
    </head>
    <body>
        <div id="myDiv">使用原生的AJAX修改该文本的内容(前端展示的数据)</div>
        <button type="button" onclick="loadXMLDoc()">修改内容</button>

        <script type="text/javascript">
            function loadXMLDoc() {
                //实例化xhr对象
                var xhr = new XMLHttpRequest();
                //使用xhr对象进行数据填充和发送请求
                //参数1：请求类型  参数2：请求路径  参数3：是否异步（异步：true  同步：false）
                xhr.open("GET", "../jsp/demo_two.jsp?name=zs&age=22", true);
                //发送请求
                xhr.send();
                //回调函数
                xhr.onreadystatechange = function() {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                        //获取服务端返回的文本内容
                        document.getElementById("myDiv").innerHTML = xhr.responseText;
                    }
                }
            }
        </script>
    </body>
</html>